<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>人员列表</title>
<%@include file="../public.jsp"%>
<script src="<%=path %>/js/user/user.js"></script>
<script>
function check() {
	 var username = $("#uname").val();
	  $.ajax({
	         type:'POST',
	         url:ctx+'/user/check',
	         data: {username:username},
	         success:function(data){
	        	 if(data.code==100){
	        		 $("#user_name").html("用户名重复！");
	        		 $("#uname").val("");
	        	 }
	        	 else{
	        		 $("#user_name").html("");
	        	 }
	         }
	     }) ; 
	}
</script>
</head>
<body>
	<%@include file="../head.jsp"%>
	<%@include file="../menu.jsp"%>
	<div class="col-sm-9 col-sm-offset-3 col-lg-10 col-lg-offset-2 main">
		<%-- <div class="row">
			<ol class="breadcrumb">
				<li><a href="<%=path %>/index"><span
						class="glyphicon glyphicon-home"></span></a></li>
				<li class="active">人员列表</li>
			</ol>
		</div> --%>
		<!--/.row-->
	</div>
	<!--/.main-->

	<br>
	<br>
	<br>
	<br>
	<!-- 搜索框 -->

	<div class="container">
		<div class="col-lg-6">
			<div class="input-group"
				style="position: absolute; margin-left: 100px;">
				<input type="text" class="form-control" id="condition1"
					name="condition1" value="${condition1}"> <input
					type="hidden" id="role" value="${user.role}"> <span
					class="input-group-btn"> <a class="btn btn-primary"
					id="searchUser">搜索</a>
				</span>
			</div>
		</div>

		<!-- end -->

		<!-- 添加用户的按钮 -->
		<c:if test="${user.role==1 }">
			<button class="btn btn-success" type="button" data-toggle="modal"
				data-target="#addProModal"
				style="position: absolute; margin-top: -1px; margin-left: 400px">新增</button>
		</c:if>
		<!-- end -->

		<!-- 添加user弹窗-->
		<div class="modal fade" id="addProModal" tabindex="-1" role="dialog"
			aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog" style="width: 500px; height: 600px;">
				<form action="<%=path%>/user/save" id="addProForm" method="post">
					<div class="modal-content">

						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"
								aria-hidden="true">&times;</button>
							<h4 class="modal-title" id="myModalLabel">添加用户</h4>
						</div>

						<div class="modal-body"
							style="overflow-y: auto; width: 497px; height: 300px;">
							用户名<input type="text" class="form-control" id="uname"
								name="username" required="required" onblur="check()"><span
								id="user_name" style="color: red;"></span><br>
							<br> 密码<input type="password" class="form-control"
								name="password" required="required"><br>
							<dt>
								<label for="name">角色</label>
							</dt>
							<dd>
								<select class="form-control" name="role">
									<option value="1">管理员</option>
									<option selected="selected" value="2">普通用户</option>
								</select><br>
							</dd>

						</div>

						<div class="modal-footer">
							<button type="button" class="btn btn-default"
								data-dismiss="modal">关闭</button>
							<button type="submit" class="btn btn-primary">保存</button>
						</div>

					</div>
					<!-- /.modal-content -->
				</form>
			</div>
		</div>
		<!-- /.modal -->
		<!-- end -->

		<!-- 删除确认 -->
		<!-- 更新密码弹框 -->
		<div class="modal fade" id="updateUserModal" tabindex="-1"
			role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog" style="width: 700px; height: 500px;">
				<form action="<%=path %>/user/updatePassword " id="updateUserForm"
					method="post">
					<div class="modal-content">

						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"
								aria-hidden="true">&times;</button>
							<h4 class="modal-title" id="myModalLabel" align="center">
								重置密码</h4>
						</div>

						<div class="modal-body"
							style="overflow-y: auto; width: 697px; height: 400px;">
							<input type="hidden" id="userId" name="id" value="">

							<dl class="dl-horizontal" style="float: left;">
								<dt>用户名</dt>
								<dd>
									<div style="width: 350px;">
										<input type="text" class="form-control" id="username1"
											name="username" required="required" disabled="disabled"><br>
									</div>
								</dd>

								<dt>密码</dt>
								<dd>
									<input type="password" class="form-control" id="uPassword"
										name="password" required="required"><br>
								</dd>
							</dl>
						</div>

						<div class="modal-footer">
							<button type="button" class="btn btn-default"
								data-dismiss="modal">关闭</button>
							<button type="submit" class="btn btn-primary">保存</button>
						</div>
					</div>
					<!-- /.modal-content -->
				</form>
			</div>
		</div>
		<!-- /.modal -->
		<!-- end -->
		<br>
		<br>
		<br>

		<!-- 表格 -->

		<div class="ProList" align="center">
			<c:if test="${user.role==1}">
				<table class="table table-bordered" style="width: 80%">
					<thead>
						<tr>
							<th style="width: 10%">#</th>
							<th style="width: 20%">用户名</th>

							<th style="width: 20%">角色</th>

							<th style="width: 15%">操作</th>
						</tr>
					</thead>

					<tbody id="userList">

					</tbody>
				</table>
			</c:if>



			<c:if test="${user.role==2}">
				<table class="table table-bordered" style="width: 80%">
					<thead>
						<tr>
							<th style="width: 35%">#</th>
							<th style="width: 35%">用户名</th>
							<th style="width: 30%">角色</th>
						</tr>
					</thead>

					<tbody id="userList">

					</tbody>
				</table>
			</c:if>

			<!-- 分页 -->
			<div id="pagination" style="position: relative;margin-left: 120px;"></div>
		</div>
	</div>
</body>
</html>